<!--
Sandstorm - Personal Cloud Sandbox
Copyright (c) 2014 Sandstorm Development Group, Inc. and contributors
All rights reserved.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->

<head>
  <title>Sandstorm</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
</body>

<template name="layout">
  {{>sandstormTopbar globalTopbar}}

  {{#with demoExpired}}
    {{>title "Demo Expired"}}

    <div id="demo-expired" class="demo-expired-main-content {{#if hideNavbar}}hide-navbar{{else}}{{#if shrinkNavbar}}shrink-navbar{{/if}}{{/if}}">
      <h1>Demo Expired</h1>
      {{#if canUpgradeDemo}}
        <p>Thanks for trying the Sandstorm Demo! Your demo account has expired. If
          you'd like to continue using Sandstorm and make your data permanent, please sign in.</p>
        <div class="login">
          {{> loginButtonsDialog accountsUi=globalAccountsUi}}
        </div>
      {{else}}
        <p>Thanks for trying the Sandstorm Demo! Your demo account has expired.
          <form class="standard-form">
            <div class="button-row">
              <button name="logout" type="submit">Sign out</button>
            </div>
          </form>
        </p>
      {{/if}}
    </div>
  {{else}}
  {{#if identityUser}}
      {{> identityLoginInterstitial grains=globalGrains}}
  {{else}}
  {{#if isAccountSuspended}}
    <div class="suspended-main-content {{#if hideNavbar}}hide-navbar{{else}}{{#if shrinkNavbar}}shrink-navbar{{/if}}{{/if}}">
      {{> accountSuspended }}
    </div>
  {{else}}
  {{#if firstLogin}}
    <div class="first-sign-in-main-content {{#if hideNavbar}}hide-navbar{{else}}{{#if shrinkNavbar}}shrink-navbar{{/if}}{{/if}}">
      {{> sandstormAccountsFirstSignIn accountSettingsUi}}
    </div>
  {{else}}

  {{!-- standard topbar items --}}
  {{#sandstormTopbarItem name="home-button" topbar=globalTopbar}}
  <a href="/">{{effectiveServerTitle}}</a>
  {{/sandstormTopbarItem}}
  {{#if showAccountButtons}}
    {{>sandstormTopbarItem name="account" topbar=globalTopbar data=accountButtonsData
                           template="accountButtons" popupTemplate="accountButtonsPopup"}}
  {{else}}
    {{>sandstormTopbarItem name="login" topbar=globalTopbar data=globalAccountsUi
                           template="loginButtons" popupTemplate="loginButtonsPopup"}}
  {{/if}}
  {{#if currentUser}}
    {{>sandstormTopbarItem name="notifications" topbar=globalTopbar
                           template="notifications" popupTemplate="notificationsPopup"
                           priority=-1}}
  {{/if}}
  {{!-- admin alerts --}}
  {{#with adminAlert}}
    {{#if adminAlertIsTooLarge}}
      {{#sandstormTopbarItem name="admin-alert" topbar=globalTopbar priority=-2}}
        {{!-- TODO(cleaup): Awkwardly, the event handlers on Template.layout actually work
            on this topbar item solely because the whole topbar itself is embedded inside the
            "layout" template. But, we shouldn't be relying on that! Move this to its own
            template... --}}
        <span id="admin-alert-icon" class="{{className}}">!</span>
      {{else}}
        <h4>Notice from Admin</h4>
        <p>
          {{#if alertUrl}}
            <a href="{{alertUrl}}" class="alert {{className}}">{{text}}</a>
          {{else}}
            <span class="alert {{className}}">{{text}}</span>
          {{/if}}
        </p>
      {{/sandstormTopbarItem}}
    {{else}}
      {{#sandstormTopbarItem name="admin-alert" topbar=globalTopbar}}
        {{#if alertUrl}}
          <a href="{{alertUrl}}" class="alert {{className}}">{{text}}</a>
        {{else}}
          <span class="alert {{className}}">{{text}}</span>
        {{/if}}
      {{/sandstormTopbarItem}}
    {{/if}}
  {{/with}}

  {{#with billingPromptState}}
    {{> Template.dynamic template=billingPromptTemplate}}
  {{/with}}

  {{/if}} {{!-- firstLogin --}}
  {{/if}} {{!-- isAccountSuspended --}}
  {{/if}} {{!-- identityUser --}}
  {{/with}} {{!-- demoExpired --}}

  {{!-- Make sure to always render the main-content div, but only yield if there is no interstitial
        to render on top. The main-content div needs to be stable so that any GrainView that gets
        attached does not get orphaned. For example, if the main-content div were inside the
        {{#if firstLogin}} block, then grain views could appear to become blanked out when a demo
        user upgrades to a real account by linking an email identity.
   --}}
  <div class="main-content{{#if hideNavbar}} hide-navbar{{else}}{{#if shrinkNavbar}} shrink-navbar{{/if}}{{/if}}{{#if isStandalone}} standalone{{/if}}">
  {{#unless demoExpired}}
    {{#unless identityUser}}
      {{#unless firstLogin}}
        {{> desktopNotifications "" }}
        {{> yield}}
      {{/unless}}
    {{/unless}}
  {{/unless}}
  </div>

  {{#with demoModal}}
    {{#modalDialogWithBackdrop onDismiss=dismissDemoModal class="demo-startup-modal"}}
      <div class="top">
          <p class="header">Sandstorm is a self-hostable web productivity suite.</p>
          <p class="body">
          {{#if appdemo}}
            with apps like {{appdemo}}.
          {{else}}
            with all the apps you need in one place.
          {{/if}}</p>

          <button class="button-primary start">
            {{#if appdemo}}Try {{appdemo}}{{else}}Start{{/if}} &raquo;
          </button>

      </div>
      <div class="bottom">
        <p>Sandstorm makes it easy to run apps on your own server. In addition to improving privacy and control, <a href="https://blog.sandstorm.io/news/2014-07-21-open-source-web-apps-require-federated-hosting.html" target="_blank">this brings Open Source apps to a wide audience.</a></p>
        <p>Sandstorm is also ridiculously secure. If security interests you, check out <a href="https://docs.sandstorm.io/en/latest/developing/security-practices/" target="_blank">Sandstorm's security model overview</a>.</p>
      </div>
    {{/modalDialogWithBackdrop}}
  {{/with}}
</template>

<template name="noLayout">
  {{!-- An empty layout for resource windows e.g. grainLog that we want to put reactive stuff in,
   but don't need the topbar and reload blocking and other fanciness that the layout gives --}}
  {{> yield}}
</template>

<template name="notifications">
  <button class="show-popup icon icon-notification" title="Notifications">
  {{#if notificationCount}}
    <span class="count">{{notificationCount}}</span>
  {{/if}}
  Notifications
  </button>
</template>

<template name="notificationsPopup">
  <h4>Notifications</h4>
  <ul class="notification-list">
    {{#each notifications}}
      <li>
        {{> notificationItem .}}
      </li>
    {{else}}
    <li>No notifications...</li>
    {{/each}}
  </ul>
</template>

<template name="title">
  {{#sandstormTopbarItem name="title" priority=5 topbar=globalTopbar}}{{.}}{{/sandstormTopbarItem}}
</template>

<template name="loading">
  {{>title "Loading..."}}
  <div class="centered-box">Loading...</div>
</template>

<template name="loadingNoMessage">
  {{!-- When switching between grains, we don't really want to show a "loading..." message until
  the grain's subscriptions are ready, since we've already loaded the iframe and the user can be
  interacting with it immediately.  But we also want to use waitOn for the topbar items.  So we
  set a loading template that is effectively empty string, and everything is great. --}}
</template>

<template name="notFound">
  {{>title "Not Found"}}
  <div class="centered-box">404 Not Found :(</div>
</template>

<template name="root">
  {{>title "Home"}}

  <div id="intro" class="{{#if splashUrl}}has-splash{{/if}}">
    {{> loginButtonsDialog accountsUi=globalAccountsUi}}
    {{#if splashUrl}}
      <iframe src="{{splashUrl}}"></iframe>
    {{/if}}
  </div>
</template>

<template name="apps">
  {{> sandstormAppListPage . }}
</template>

<template name="grains">
  {{> sandstormGrainListPage . }}
</template>

<template name="appDetails">
  {{> sandstormAppDetailsPage . }}
</template>

<template name="grainLogContents">
  <pre>...{{{logHtml}}}</pre>
</template>

<template name="grainLog">
  <div class="grainlog-title">Debug log: {{title}}</div>
  <div class="grainlog-contents" aria-live="polite">
    {{> grainLogContents logHtml=html onRenderedHook=maybeScrollToBottom }}
  </div>
</template>

<template name="install">
  {{> sandstormAppInstallPage . }}
</template>

<template name="account">
{{!-- Data context is an instance of SandstormAccountSettingsUi --}}
  <div class="account">
    {{#if .}}
      {{>sandstormAccountSettings .}}
    {{/if}}
  </div>
</template>

<template name="signup">
  {{>title "Claim Invite"}}

  <div class="centered-box">
  {{#if alreadySignedUp}}
    {{#if keyIsUsed}}
      <p>You're all signed up!  Now go <a href="https://apps.sandstorm.io/?host={{origin}}">install
        some apps</a>.</p>
    {{else}}
      <p>It looks like you already have an account, so you don't need this signup key.</p>
    {{/if}}
  {{else}}
    {{#if keyIsValid}}
      {{#if keyIsUsed}}
        <p>Sorry, this signup key has already been used.</p>
      {{else}}
        {{#if currentUser}}
          <p>Please wait...</p>
        {{else}}
          <p>{{signupDialog}} First, you have to sign in. Click "Sign in" in the upper-right.</p>
          <div id="sign-in-arrow"></div>
        {{/if}}
      {{/if}}
    {{else}}
      <p>Sorry, this is not a valid signup key.</p>
    {{/if}}
  {{/if}}
  </div>
</template>

<template name="uploadStatus">
  {{>title "Uploading..."}}

  <div id="restoreGrain" class="centered-box">
  {{#if error}}
    <p>Upload failed: {{error.status}} {{error.statusText}}</p>
    <pre>{{error.response}}</pre>
  {{else}}
    {{#if status}}
      <p>{{status}}... {{#if progress}}{{progress}}%{{/if}}</p>
    {{else}}
      <p>Upload failed. Please try again.</p>
    {{/if}}
  {{/if}}
  </div>
</template>

<template name="uploadTest">
  {{>title "Upload test page"}}

  <p>This page is intended for use by the test scripts.</p>

  <p>Upload app: <input type="file" id="upload-app"></p>
  <p>Upload backup: <input type="file" id="upload-backup"></p>
</template>

<template name="referrals">
  {{#if referralsEnabled}}
  {{>title "Referral Program"}}
  {{setDocumentTitle}}
  <div class="referrals">
    <h1>Referral Program</h1>
    <header>
      {{#if isPaid}}
      <h2>Get up to <span class="reward-amount">30 GB</span> of free space when your friends share on Oasis!</h2>
      {{else}}
      <h2>Get unlimited grains &amp; up to <span class="reward-amount">2 GB</span> of free space when
        your friends share on Oasis!</h2>
      {{/if}}

      {{#if isPaid}}
      <p>
        For each friend that creates a sharing link, we'll reward you with 2 GB.
      </p>
      {{else}}
      <p>
        For each friend that creates a sharing link, we'll reward you with 50 MB.
        You'll also get unlimited grains.
      </p>
      {{/if}}
    </header>
    <section>
      <h1>Sharing is referring</h1>
      <p>To get started, open any grain and click Share access.</p>

      <div class="image-tutorial">
      <ol>
        <li>You share a grain with your friend (who isn't already an Oasis user).
          <img src="/referral-graphics/referral-1.svg">
        </li>
        <li>Your friend signs in.
          <img src="/referral-graphics/referral-2.svg">
        </li>
        <li>Your friend shares a grain with any other person (including you).
          <img src="/referral-graphics/referral-3.svg">
        </li>
      </ol>

      </div>

      {{#if currentUser}}
      <h2>Your referrals &amp; status</h2>

      <p>Once you send a sharing link out, people will appear in this list
        after they sign in.</p>

      {{#with notYetCompleteReferralNames}}{{#if this.count}}
      <h3>Still needs to share</h3>

      <p class="gentle-hint">Tell these people to make a grain and share it with you. You
        must actually view the grain they shared with you!</p>

      <ul class="comma-separated-ul">
        {{#each this}}
        <li>{{name}}</li>
        {{/each}}
      </ul>

      {{/if}}{{/with}}

      {{#with completeReferralNames}}{{#if this.count}}
      <h3>Successful referrals</h3>

      <p class="gentle-hint">You've successfully referred these people. Congratulations!</p>

      <ul class="comma-separated-ul">
        {{#each this}}
        <li>{{name}}</li>
        {{/each}}
      </ul>

      {{/if}}{{/with}}

      <h2 class="fine-print">The fine print</h2>

      <p>Your referral bonus lasts until 1 year after the
          referral. The terms of this referral program may
          change without warning; however, such changes will not affect
          bonuses you have already received. If you need even more
          space, <a href="{{pathFor route='account'}}">upgrade your
          account.</a>
      </p>

      <p>Paid subscribers can get up to 30 GB of free storage, 2 GB per
        person they refer, in addition to the storage from their
        account level. Free account holders can earn unlimited grains
        and 50 MB of free storage per person they refer, up to 2 GB
        total.</p>

      {{/if}}
    </section>
  </div>
  {{/if}}
</template>

<template name="about">
  {{setDocumentTitle}}
  {{>title "About Sandstorm"}}

  <div class="about">
    <h1>About Sandstorm</h1>

    <section class="intro">
      <p><a href="https://sandstorm.io">Sandstorm.io</a> is an open source hosting platform for
        personal/private instances of web apps. Users can upload and install arbitrary software
        through a simple app-store-like web interface. In addition to better privacy,
        <a href="https://blog.sandstorm.io/news/2014-07-21-open-source-web-apps-require-federated-hosting.html">
        this is the only way to make Open Source web apps viable.</a></p>

      <p class="version">Version: {{build}}</p>
      {{#if isUnofficial}}
        <p class="unofficial"><b>WARNING:</b> This server is running an unofficial build of Sandstorm which may contain modifications not reviewed by the developers.</p>
      {{/if}}
    </section>

    <section class="changelog">
      <h2>Recent changes</h2>

      {{> changelog ""}}
    </section>

    <section class="developers">
      <h2>Core developers</h2>
      <ul>
        <li><a href="https://github.com/kentonv">
            <img src="/logos/kenton.png" alt="Kenton Varda">
            Kenton Varda</a></li><li>
        <a href="https://github.com/jadeqwang">
            <img src="/logos/jade.png" alt="Jade Wang">
            Jade Wang</a></li><li>
        <a href="https://github.com/jparyani">
            <img src="/logos/jason.png" alt="Jason Paryani">
            Jason Paryani</a></li><li>
        <a href="https://github.com/dwrensha">
            <img src="/logos/david.png" alt="David Renshaw">
            David Renshaw</a></li><li>
        <a href="https://github.com/paulproteus">
            <img src="/logos/asheesh.png" alt="Asheesh Laroia">
            Asheesh Laroia</a></li><li>
        <a href="http://nenanguyen.ca">
            <img src="/logos/nena.png" alt="Néna Nguyễn">
            Néna Nguyễn</a></li><li>
        <a href="https://github.com/zarvox">
            <img src="/logos/drew.png" alt="Drew Fisher">
            Drew Fisher</a></li><li>
        <a href="https://plus.google.com/u/0/114357619139436426265">
            <img src="/logos/garply.png" alt="Garply">
            Garply</a></li>
      </ul>
    </section><section class="advisors">
      <h2>Advisors</h2>
      <ul>
        <li><a href="https://github.com/swetland">
            <img src="/logos/swetland.png" alt="Brian Swetland">
            Brian Swetland</a></li><li>
        <a href="https://github.com/amluto">
            <img src="/logos/luto.png" alt="Andrew Lutomirski">
            Andrew Lutomirski</a></li><li>
        <a href="https://github.com/jasvir">
            <img src="/logos/jasvir.png" alt="Jasvir Nagra">
            Jasvir Nagra</a></li><li>
        <a href="https://github.com/mseaborn">
            <img src="/logos/seaborn.png" alt="Mark Seaborn">
            Mark Seaborn</a></li><li>
        <a href="http://en.wikipedia.org/wiki/Mark_S._Miller">
            <img src="/logos/miller.png" alt="Mark Miller">
            Mark Miller</a></li>
      </ul>
    </section>
    <br>
    <section class="corporate">
      <h2>Corporate sponsors</h2>
      <p>These companies contributed heavily to Sandstorm's <a href="http://igg.me/at/sandstorm">crowdfunding campaign</a>.</p>
      <ul>
        <li><a href="http://draw.io"><img width="92.75" height="121" src="/logos/draw.io-logo.svg">&nbsp;</a></li><li>
        <img src="/logos/humanweb.png">&nbsp;</li><li>
        <a href="https://uniregistry.com"><div class="uniregistry-image"></div>&nbsp;</a></li>
      </ul>
      <div class="strut"></div>
    </section><section class="individual">
      <h2>Key invididual sponsors</h2>
      <p>These individuals contributed heavily to Sandstorm's <a href="http://igg.me/at/sandstorm">crowdfunding campaign</a>.</p>
      <ul>
      <li><a href="http://rogerwagner.com/">
          <img src="/logos/wagner.png">
          Roger Wagner</a></li><li>
      <a href="https://github.com/audreyt">
          <img src="/logos/audrey.png">
          Audrey Tang</a></li>
      </ul>
    </section>

    <section class="backers">
      <h2>Backers</h2>
      <p>from <a href="http://igg.me/at/sandstorm">our Indiegogo campaign &gt;</a></p>
      {{#if backers}}
      <ul>
        {{#each backers}}
          <li>{{.}}</li>
        {{/each}}
        <li>&nbsp;</li>
        <li>&nbsp;</li>
        <li>&nbsp;</li>
        <li class="anonymous">and {{anonCount}} anonymous contributors</li>
      </ul>
      {{else}}
      <p>loading...</p>
      {{/if}}
    </section>

    <section class="dependencies">
      <h2>Third-party works used</h2>
      <ul>
        <!-- TODO(soon): This list has a lot missing. Review. -->
        <li><a href="http://nodejs.org/">Node.js</a> (MIT license)</li>
        <li><a href="https://www.meteor.com/">Meteor web framework</a> (MIT license)</li>
        <li><a href="https://github.com/jedisct1/libsodium">libsodium</a> (ISC license)</li>
        <li><a href="https://github.com/seccomp/libseccomp">libseccomp</a> (LGPL license)</li>
        <li><a href="https://www.mongodb.org/">MongoDB</a> (AGPL)</li>
        <li><a href="https://github.com/EventedMind/iron-router">Iron Router</a> (MIT license)</li>
        <li><a href="http://underscorejs.org/">Underscore.js</a> (MIT license)</li>
        <li><a href="http://www.senchalabs.org/connect/">Connect middleware</a> (MIT license)</li>
        <li><a href="https://www.google.com/fonts/specimen/Source+Sans+Pro">Source Sans Pro font</a> (SIL OFL)</li>
        <li><a href="https://github.com/joyent/http-parser">Node/nginx HTTP parser library</a> (MIT license)</li>
        <li><a href="https://github.com/andris9/simplesmtp">Simple SMTP by Andris Reinman</a> (MIT license)</li>
        <li><a href="https://github.com/justmoon/node-bignum">node-bignum by Stefan Thomas</a> (MIT license)</li>
        <li><a href="https://github.com/drudru/ansi_up">ansi_up library by Dru Nelson</a> (MIT license)</li>
        <li><a href="https://github.com/stewartlord/identicon.js">identicon.js by Stewart Lord</a> (BSD license)</li>
        <li><a href="https://github.com/usablica/intro.js">intro.js by Afshin Mehrabani</a> (MIT license)</li>
        <li><a href="http://www.xarg.org/2010/03/generate-client-side-png-files-using-javascript/">PNGlib by Robert Eisele</a> (BSD license)</li>
        <li><a href="http://libb64.sourceforge.net/">libb64 by Chris Venter</a> (Public Domain)</li>
        <li><a href="http://tukaani.org/xz/">XZ Utils</a> (Public Domain / GPL)</li>
        <li><a href="http://www.info-zip.org/">Info-ZIP</a> (Info-ZIP license)</li>
        <li><a href="http://www.gnu.org/software/libc/libc.html">GNU C library</a> (LGPL license)</li>
        <li><a href="https://gcc.gnu.org/libstdc++/">GNU C++ Library</a> (LGPL license)</li>
        <li class="spacer">&nbsp;</li>
        <li class="spacer">&nbsp;</li>
        <li class="spacer">&nbsp;</li>
      </ul>
      <p>These works are copyright the respective authors and used under the terms of the respective
        licenses.</p>
    </section>

    <section class="copyright">
      <h2>Copyright</h2>
      <p>The Sandstorm implementation is copyright by Sandstorm Development Group, Inc. and
         contributors. The implementation is licensed under the Apache License 2.0.</p>
      <p>"Sandstorm" and the Sandstorm logo are trademarks of Sandstorm Development Group, Inc.,
         and may not be used to advertise derivative works nor commercial services without
         written consent from Sandstorm Development Group, Inc.</p>
    </section>

    <section class="terms">
      <ul>
        <li><a href="https://github.com/sandstorm-io/sandstorm/blob/master/LICENSE">License</a></li>
        {{#with termsUrl}}<li><a href="{{.}}">Terms of service</a></li>{{/with}}
        {{#with privacyUrl}}<li><a href="{{.}}">Privacy policy</a></li>{{/with}}
      </ul>
    </section>
  </div>
</template>
